<template>
  <el-dialog v-loading="loading" :visible.sync="visible" title="接口授权" :close-on-click-modal="false" :close-on-press-escape="false">
    <div class="mod-message__mail-template">
      <el-row>
        <el-transfer
          v-model="apiList"
          :data="apiData"
          @change="rightChange"
          :titles="['未授权', '已授权']"
          :button-texts="['解除授权', '添加授权']"
        ></el-transfer>
      </el-row>
    </div>
  </el-dialog>
</template>

<script>
export default {
  data () {
    return {
      loading: false,
      visible: false,
      app: {},
      apiData: [],
      apiList: []
    }
  },
  computed: {
    dataRule () {
      return {}
    }
  },
  methods: {
    init () {
      this.visible = true
      this.$nextTick(() => {
        this.apiData = []
        this.apiList = []
        this.loading = true
        Promise.all([
          this.getAllReceiveApi(),
          this.getApiByAppId()
        ]).then(() => {
          this.loading = false
        })
      })
    },
    // 获取信息
    getAllReceiveApi () {
      this.$http.get(`/api/apiConf/receiveApiList`).then(({ data: res }) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        res.data.forEach(res => {
          this.apiData.push({
            key: res.apiCode,
            label: res.apiName,
            disabled: false
          })
        })
      }).catch(() => { })
    },
    // 获取订阅的接口
    getApiByAppId () {
      this.$http.get(`/api/apiConf/receiveApiListByAppId?appId=${this.app.appId}`).then(({ data: res }) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        res.data.forEach(res => {
          this.apiList.push(res.apiCode)
        })
      }).catch(() => { })
    },
    // 订阅发生变化时
    rightChange (val, direction, moveData) {
      var params = {
        appId: this.app.appId,
        apiData: moveData,
        direction: direction
      }
      // 修改接口授权
      this.loading = true
      this.$http.post(`/api/apiAppSubscription/saveAppApi`, params).then(({ data: res }) => {
        this.loading = false
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
      }).catch(() => { })
    }
  }
}
</script>
